<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="../base.jsp" %>
<style>
	.content-wrapper{margin-left: 0px}
</style>
<link rel="stylesheet" type="text/css" href="${url }css/style.css">
<script type="text/javascript">
$(function() {
	init();
	init2();
});

function init(){
	$.ajax({
		type:"POST",
		url: path+'local/getNodesList',
		success: function(result){
			$("#freeNodeList").html("");
			if(result){
				for(var item in result.result){
					var appendStr="<div class='node' draggable='true' id='"+result.result[item].hostname+"'  title='"+item+"'> "+result.result[item].hostname+"</div>";
					$("#freeNodeList").append(appendStr);
				}
			}	
		}
	}); 
}

function init2(){
	var old=10000;
	$.ajax({
		type:"POST",
		url: path+'local/getNodesList',
		success: function(result){
			if(result){
				for(var item in result.result){
					//alert(result.result[item].services);
					var hadoopOrHbase=0;
					for(var i = 0; i<result.result[item].services.length;i++){
						for(var itemObj in result.result[item].services[i]){
							if(result.result[item].services[i][itemObj].state==1){
								var appendId=result.result[item].hostname+"_"+old;
								if("logstash_tokafka"==itemObj){
									var appendStr="<div class='node' draggable='false' id='"+appendId+"' title='"+item+"'>"+result.result[item].hostname+"</div>";
									$("#logstash_tokafka").append(appendStr);
									old = parseInt(old)-1;
								}else if("kafka"==itemObj){
									var appendStr="<div class='node' draggable='false' id='"+appendId+"' title='"+item+"'>"+result.result[item].hostname+"</div>";
									$("#kafka").append(appendStr);
									old = parseInt(old)-1;
								}else if("logstash_toes"==itemObj){
									var appendStr="<div class='node' draggable='false' id='"+appendId+"' title='"+item+"'>"+result.result[item].hostname+"</div>";
									$("#logstash_toes").append(appendStr);
									old = parseInt(old)-1;
								}else if("elasticsearch"==itemObj){
									var appendStr="<div class='node' draggable='false' id='"+appendId+"' title='"+item+"'>"+result.result[item].hostname+"</div>";
									$("#elasticsearch").append(appendStr);
									old = parseInt(old)-1;
								}else if("hbasemaster"==itemObj || "hadoopdatanode"==itemObj){
									hadoopOrHbase =  parseInt(hadoopOrHbase)+1;
									if(hadoopOrHbase==2){
										var appendStr="<div class='node' draggable='false' id='"+appendId+"' title='"+item+"'>"+result.result[item].hostname+"</div>";
										$("#hbaseOrHadoop").append(appendStr);
										old = parseInt(old)-1;
									}
								}else if("spark"==itemObj){
									var appendStr="<div class='node' draggable='false' id='"+appendId+"' title='"+item+"'>"+result.result[item].hostname+"</div>";
									$("#spark").append(appendStr);
									old = parseInt(old)-1;
								}
							}
						}
					}
				}
			}	
		}
	});
}

function startAllService(){
	if(confirm('确实要进行此操作吗?')){
	$("#logstash_tokafka").children("div").each(
		function(){
			var ip =$(this).attr("title");
			$.ajax({
				cache:false,
				async:false,
				type:"POST",
				url: path+'cluster/getNodeStatus',
				data:{serviceName:"logstash_tokafka",ip:ip},
				success: function(result){
					if(result){
						var status = result.result["logstash_tokafka"].status;
						if(status=="stopped"){
							startNode("logstash_tokafka", ip);
						}
					}
				}
			});
		}		
	);
	$("#kafka").children("div").each(
			function(){
				var ip =$(this).attr("title");
				$.ajax({
					cache:false,
					async:false,
					type:"POST",
					url: path+'cluster/getNodeStatus',
					data:{serviceName:"kafka",ip:ip},
					success: function(result){
						if(result){
							var status = result.result["kafka"].status;
							if(status=="stopped"){
								startNode("kafka", ip);
							}
						}
					}
				});
			}		
		);
	$("#logstash_toes").children("div").each(
			function(){
				var ip =$(this).attr("title");
				$.ajax({
					cache:false,
					async:false,
					type:"POST",
					url: path+'cluster/getNodeStatus',
					data:{serviceName:"logstash_toes",ip:ip},
					success: function(result){
						if(result){
							var status = result.result["logstash_toes"].status;
							if(status=="stopped"){
								startNode("logstash_toes", ip);
							}
						}
					}
				});
			}		
		);
	$("#elasticsearch").children("div").each(
			function(){
				var ip =$(this).attr("title");
				$.ajax({
					cache:false,
					async:false,
					type:"POST",
					url: path+'cluster/getNodeStatus',
					data:{serviceName:"elasticsearch",ip:ip},
					success: function(result){
						if(result){
							var status = result.result["elasticsearch"].status;
							if(status=="stopped"){
								startNode("elasticsearch", ip);
							}
						}
					}
				});
			}		
		);
	$("#hbaseOrHadoop").children("div").each(
			function(){
				var ip =$(this).attr("title");
				$.ajax({
					cache:false,
					async:false,
					type:"POST",
					url: path+'cluster/getNodeStatus',
					data:{serviceName:"hbasemaster",ip:ip},
					success: function(result){
						if(result){
							var status = result.result["hbasemaster"].status;
							if(status=="stopped"){
								startNode("hbasemaster", ip);
							}
						}
					}
				});
				$.ajax({
					cache:false,
					async:false,
					type:"POST",
					url: path+'cluster/getNodeStatus',
					data:{serviceName:"hadoopdatanode",ip:ip},
					success: function(result){
						if(result){
							var status = result.result["hadoopdatanode"].status;
							if(status=="stopped"){
								startNode("hadoopdatanode", ip);
							}
						}
					}
				});
			}		
		);
	$("#spark").children("div").each(
			function(){
				var ip =$(this).attr("title");
				$.ajax({
					cache:false,
					async:false,
					type:"POST",
					url: path+'cluster/getNodeStatus',
					data:{serviceName:"spark",ip:ip},
					success: function(result){
						if(result){
							var status = result.result["spark"].status;
							if(status=="stopped"){
								startNode("spark", ip);
							}
						}
					}
				});
			}		
		);
	alert("全部启动成功");
	}
}

function stopAllService(){
	if(confirm('确实要进行此操作吗?')){
	$("#logstash_tokafka").children("div").each(
			function(){
				var ip =$(this).attr("title");
				$.ajax({
					cache:false,
					async:false,
					type:"POST",
					url: path+'cluster/getNodeStatus',
					data:{serviceName:"logstash_tokafka",ip:ip},
					success: function(result){
						if(result){
							var status = result.result["logstash_tokafka"].status;
							if(status=="running"){
								stopNode("logstash_tokafka", ip);
							}
						}
					}
				});
			}		
		);
		$("#kafka").children("div").each(
				function(){
					var ip =$(this).attr("title");
					$.ajax({
						cache:false,
						async:false,
						type:"POST",
						url: path+'cluster/getNodeStatus',
						data:{serviceName:"kafka",ip:ip},
						success: function(result){
							if(result){
								var status = result.result["kafka"].status;
								if(status=="running"){
									stopNode("kafka", ip);
								}
							}
						}
					});
				}		
			);
		$("#logstash_toes").children("div").each(
				function(){
					var ip =$(this).attr("title");
					$.ajax({
						cache:false,
						async:false,
						type:"POST",
						url: path+'cluster/getNodeStatus',
						data:{serviceName:"logstash_toes",ip:ip},
						success: function(result){
							if(result){
								var status = result.result["logstash_toes"].status;
								if(status=="running"){
									stopNode("logstash_toes", ip);
								}
							}
						}
					});
				}		
			);
		$("#elasticsearch").children("div").each(
				function(){
					var ip =$(this).attr("title");
					$.ajax({
						cache:false,
						async:false,
						type:"POST",
						url: path+'cluster/getNodeStatus',
						data:{serviceName:"elasticsearch",ip:ip},
						success: function(result){
							if(result){
								var status = result.result["elasticsearch"].status;
								if(status=="running"){
									stopNode("elasticsearch", ip);
								}
							}
						}
					});
				}		
			);
		$("#hbaseOrHadoop").children("div").each(
				function(){
					var ip =$(this).attr("title");
					$.ajax({
						cache:false,
						async:false,
						type:"POST",
						url: path+'cluster/getNodeStatus',
						data:{serviceName:"hbasemaster",ip:ip},
						success: function(result){
							if(result){
								var status = result.result["hbasemaster"].status;
								if(status=="running"){
									stopNode("hbasemaster", ip);
								}
							}
						}
					});
					$.ajax({
						cache:false,
						async:false,
						type:"POST",
						url: path+'cluster/getNodeStatus',
						data:{serviceName:"hadoopdatanode",ip:ip},
						success: function(result){
							if(result){
								var status = result.result["hadoopdatanode"].status;
								if(status=="running"){
									stopNode("hadoopdatanode", ip);
								}
							}
						}
					});
				}		
			);
		$("#spark").children("div").each(
				function(){
					var ip =$(this).attr("title");
					$.ajax({
						cache:false,
						async:false,
						type:"POST",
						url: path+'cluster/getNodeStatus',
						data:{serviceName:"spark",ip:ip},
						success: function(result){
							if(result){
								var status = result.result["spark"].status;
								if(status=="running"){
									stopNode("spark", ip);
								}
							}
						}
					});
				}		
			);
		alert("全部关闭成功");
	}
}


function startNode(serviceName,ip){
		$.ajax({
			cache:false,
			async:false,
			type:"POST",
			url: path+'cluster/startNodeByIpAndServiceName',
			data:{serviceName:serviceName,ip:ip},
			success: function(result){
				if(result){
				}
			}
		});
}

function stopNode(serviceName,ip){
	$.ajax({
		cache:false,
		async:false,
		type:"POST",
		url: path+'cluster/stopNodeByIpAndServiceName',
		data:{serviceName:serviceName,ip:ip},
		success: function(result){
			if(result){
			}
		}
	});
}
</script>
<body class="hold-transition skin-blue sidebar-mini">
<body class="hold-transition skin-blue sidebar-mini">

	<div class="wrapper">
		<!-- Content Wrapper. Contains page content -->
		<div class="content-wrapper">
			<!-- Content Header (Page header) -->
			<section class="content-header">
				<h1>集群配置<small></small></h1>
				<ol class="breadcrumb">
					<li><a href="javascript:;"><i class="fa fa-dashboard"></i> 集群配置</a></li>
				</ol>
				<ol class="breadcrumb">
					<li><input  onclick="startAllService()" type="button" value="启动所有服务" />&nbsp;<input  onclick="stopAllService()" type="button" value="关闭所有服务" /></li>
				</ol>
			</section>
			<!-- Main content -->
<section class="content">
	<div class="del">
		<a href="#" class="delete">删除</a>
		<a href="#" class="del-cal">取消</a>
	</div>
	<div class="tast-all">
		<div class="tast">
			<span>弹出提示</span>
			<input type="text" class="avalue" placeholder="node">
			<a href="#" class="success">确定</a>
			<a href="#" class="cancel">取消</a>
		</div>
	</div>
	<div class="container clearfix">
		<div class="pull-left">
			<div class="box-sm-all">
				<div id="logstash_tokafka" class="box-sm subset" >
					<h2>数据集中集群</h2>
				</div>
				<span class="arrow arrow1"></span>
				<div id="kafka" class="box-sm subset">
					<h2>数据缓存集群</h2>
				</div>
				<span class="arrow arrow2"></span>
				<div id="logstash_toes" class="box-sm subset">
					<h2>数据解析集群</h2>
				</div>
			</div>
			<div class="box-lg">
				<h2>空闲节点</h2>
				<div id="freeNodeList">
					<!-- <div class="node" draggable="true" id="node1"> node1</div>
					<div class="node" draggable="true" id="node2"> node2</div>
					<div class="node" draggable="true" id="node3"> node3</div>
					<div class="node" draggable="true" id="node4"> node4</div> -->
				</div>
			</div>
		</div>
		<span class="arrow arrow3"></span>
		<span class="arrow arrow4"></span>
		<span class="arrow arrow5"></span>
		<div class="pull-right">
			<div id="elasticsearch" class="box-right subset">
				<h2>数据在线集群</h2>
			</div>
			<div id="hbaseOrHadoop" class="box-right subset">
				<h2>数据离线存储</h2>
			</div>
			<div id="spark" class="box-right subset">
				<h2>分布式运算集群</h2>
			</div>
		</div>
	</div>
	<!-- 版本:v1.2 -->
</section>
</div></div>
</body>
<script type="text/javascript">

	$(function(){
		var oId = 1;
		var data;
		// 鼠标右键
		$(".subset").on("mouseup",".node",function(oEvent){  
			// alert("asd");
		    if (!oEvent) oEvent=window.event;  
		    if (oEvent.button==2) {  
		        var x =oEvent.clientX+5;
		        var y =oEvent.clientY+5;
		        console.log(x+","+y)
		        $(".del").css({
		        	"top":y+"px",
		        	"left":x+"px",
		        }).show();
		    }
		    var id = $(this).attr("id");
		    del(id,$(this).siblings("h2").text(),$(this).attr("title"));  
		})
		// 阻止默认菜单
		$(".node").contextmenu(function(event) {  
		    if (document.all) {  
		        window.event.returnValue = false;}// for IE  
		    else {  
		        event.preventDefault();}  
		    });
		
		$(".box-sm").on("contextmenu","div",function(event) { 
		    if (document.all) {  
		        window.event.returnValue = false;}// for IE  
		    else {  
		        event.preventDefault();}  
		    });
		
	    // 删除
	    function del(id,topName,dIp){
		    $(".del-cal").click(function(){
		    	$(".del").hide();
		    })
		    $('.delete').off().click(function () {
					});
		    $(".delete").click(function(){
		    	$("#"+id).remove();
		    	$(".del").hide();
		    	$("#"+id.substring(0,id.indexOf("_"))).show();
		    	if(topName=="数据集中集群"){
					changeState("logstash_tokafka",dIp,0);
				}else if(topName=="数据缓存集群"){
					changeState("kafka",dIp,0);
				}else if(topName=="数据解析集群"){
					changeState("logstash_toes",dIp,0);
				}else if(topName=="数据在线集群"){
					changeState("elasticsearch",dIp,0);
				}else if(topName=="数据离线存储"){
					changeState("hbasemaster",dIp,0);
					changeState("hadoopdatanode",dIp,0);
				}else if(topName=="分布式运算集群"){
					changeState("spark",dIp,0);
				}
		    })
	    }
		function dropall(node){
			$("."+node).each(function(){
				this.ondragover = function(even){
				even.preventDefault();
				};
				this.ondrop = function(even){
					even.preventDefault();
					data=localStorage.Id;
					//debugger;
					var that = this;
					var ivalue = $.trim($("[id='"+data+"']").text());
					 console.log(ivalue);
					$(".avalue").val(ivalue);
					var arr = new Array();
					var str;
					$(that).find("div").each(function(){
						str =$(this).attr("id").substring(0,$(this).attr("id").indexOf("_"));
						arr.push(str);
					})
					if (arr.indexOf(data)==-1) {
							$(".tast-all").show();
						};
					$('.success').off().click(function () {
					});
					$(".success").click(function(even){
						// var ivalue1 = $("#"+data).text();
						even.preventDefault();
						// console.log(data);
						$(".tast-all").hide();
						$("#"+data).clone(true).attr('id',data+"_"+oId).attr("draggable","false").appendTo(that); 
						$("#"+data+"_"+oId).text($(".avalue").val());
						oId++;
						jude(data);
						var dIp="";
						$(that).children().each(
							function(){
								if($(this).attr("id")){
									if($(this).attr("id").substring(0,$(this).attr("id").indexOf("_"))==data){
										dIp = $(this).attr("title");
									}	
								}
							}		
						);
						if($(that).children("h2").text()=="数据集中集群"){
							changeState("logstash_tokafka",dIp,1);
						}else if($(that).children("h2").text()=="数据缓存集群"){
							changeState("kafka",dIp,1);
						}else if($(that).children("h2").text()=="数据解析集群"){
							changeState("logstash_toes",dIp,1);
						}else if($(that).children("h2").text()=="数据在线集群"){
							changeState("elasticsearch",dIp,1);
						}else if($(that).children("h2").text()=="数据离线存储"){
							changeState("hbasemaster",dIp,1);
							changeState("hadoopdatanode",dIp,1);
						}else if($(that).children("h2").text()=="分布式运算集群"){
							changeState("spark",dIp,1);
						}
					})
					$(".cancel").click(function(){
						$(".tast-all").hide();
					})
					
				}
			
			})

		}
		
		function changeState(serviceName,ip,state){
			$.ajax({
				type:"POST",
				url: path+'cluster/updateState',
				data:{serviceName:serviceName,ip:ip,state:state},
				success: function(result){
					 if(result){
						 console.dir(result);
					 }
				}
			}); 
		}
		
		function jude(id){
			var arr1 = new Array();
			var j=0;
			$(".subset").find("div").each(function(){
				var str1 = $(this).attr("id").substring(0,$(this).attr("id").indexOf("_"));
				arr1.push(str1);
			})
			for(var i=0;i<arr1.length;i++){
				if (arr1[i]==id) {
					j++;
				};
			}
			if(j>=6){
				$("#"+id).hide();
			}
		}
		// 判断是否存在
		$(".box-lg").on("dragstart","div",function(even){
			
			localStorage.Id=even.target.id;
		})
		dropall("box-sm");
		dropall("box-right");

		// 动态追加
		/* var div = "<div class='node' draggable='true'  id='node1'>node1</div><div class='node' draggable='true' id='node2'> node2</div>";
		$(".box-lg > div").append(div); */
		
	})

	
</script>